<template>
	<view>
		<!-- 状态栏 -->
		<view class="statusBar" :style="'height:'+statusBarHeight+'px'"></view>
		<view class="myheader padding-sm font-sub-title">
			<text class="cuIcon-back margin-right-ssm" @click="back()"></text>
			添加关注
		</view>
		<view class="cu-list menu sm-border margin-top">
			<view class="cu-item bg-white" style="height: 80rpx;min-height: 80rpx;">
				<view>
					<input style="width: 100%;" v-model="phone" maxlength="11" placeholder="请输入申请关注的手机号" />
				</view>
			</view>
			<view class="cu-item bg-white">
				<view class="main">
					<view class="text-center"><button class="cu-btn login-btn font-normal" @tap="apply()">申请关注</button></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import checkUtil from '@/utils/checkUtil.js'
	export default {
		data() {
			return {
				statusBarHeight:Vue.prototype.StatusBar,
				phone:'',
			}
		},
		methods: {
			back(){
				uni.navigateBack();
			},
			apply(){
				var that = this;
				if(!checkUtil.checkPhone(this.phone)){
					uni.showToast({
						"title":"请输入正确的手机号",
						"position":"bottom",
						"icon":"none"
					})
					return;
				}
				this.$http.applyFollow({
					phone:that.phone
				}).then(res=>{
					if(res.message=='ok'){
						uni.showToast({
							title:"申请成功"
						})
					}else{
						uni.showToast({
							title:res.message,
							position:'bottom',
							icon:'none'
						})
					}
				})
			}
		}
	}
</script>

<style>
.login-btn {
	border-radius: 0;
	background-color: #427EE3!important;
	color: #fff;
	width: 100%;
	height: 80rpx;
	margin-top:30rpx;
}
.main {
	width: 100%;
}
</style>
